import { Component } from 'react'
import { View } from '@tarojs/components';
import { AtTabBar } from 'taro-ui'
// import { AtIcon } from 'taro-ui'
import './tabBar.less'
import '../../icon/iconfont.less'


export default class tabbar extends Component {
    constructor() {
        super(...arguments)
        this.state = {
            current: 0
        }
    }
    handleClick(value) {
        this.setState({
            current: value
        })
    }

    render() {
        return (
            <View>
                <View style={{ 'height': '4rem' }} />
                <AtTabBar fixed//固定底部
                  backgroundColor='#ffffff'
                  color='#cccccc'
                  selectedColor='#FF8000'
                  tabList={[
                        { title: '首页', iconType: 'iconfont icon-home' },
                        { title: '今日热点', iconType: 'iconfont icon-redian' },
                        { title: '健康档案', iconType: 'iconfont icon-jiankangdangan2' },
                        { title: '我的', iconType: 'iconfont icon-wode1'}
                  ]}
                  onClick={this.handleClick.bind(this)}
                  current={this.state.current}
                />
            </View>
            // <View className='tabbar'>
            // <Text> icon </Text>
            // <AtIcon className='icon' prefixClass='icon' value='redian' size='30' color='#FF8000'></AtIcon>
            // <Text class='iconfont icon-redian'style='font-size:30PX;color:#FF8000;'>热点</Text>
            // </View>
        );
    }
}